<style>
    .layui-laypage li{float: left;}
    .layui-laypage .active span{background: #009688; color: #fff;}
    .recharge{position: fixed; width: 600px; height: 400px; z-index: 9; background: #fff; border: solid 1px #999; top: 50%; left: 50%; margin-left: -300px; margin-top: -300px; box-shadow:#999 5px 5px 5px; display: none;}
    .cls{position: absolute; width: 50px; height: 50px; right: 0px; top: 5px; cursor: pointer;}
</style>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>注册会员列表</legend>
</fieldset>


<div class="layui-form">
    <table class="layui-table">
        <colgroup>
            <col width="50">
            <col width="100">
            <col width="100">
            <col width="50">
            <col width="100">
            <col>
        </colgroup>


        <thead>
        <tr>
            <th>ID</th>
            <th>用户名</th>
            <th>昵称</th>
            <th>余额</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>


        {volist name="list" id="vo"}
        <tr>
            <td>{$vo.m_id}</td>
            <td>{$vo.mem_name}</td>
            <td>{$vo.nick_name}</td>
            <td>{$vo.balance}</td>
            <td><a href="javascript:void(0);" onclick="recharge({$vo.m_id})">充值</a>   删除</td>
        </tr>
        {/volist}
        </tbody>
    </table>
</div>
<ul class="layui-box layui-laypage layui-laypage-default">
    {$list|raw}
</ul>

<div class="recharge">
    <div class="cls"><i class="layui-icon layui-icon-close-fill"></i> </div>
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>表单集合演示</legend>
    </fieldset>
    <form class="layui-form" action="{:url('balanceUp')}">
        <div class="layui-form-item">
            <label class="layui-form-label">会员id</label>
            <div class="layui-input-block">
                <label class="layui-form-label" id="muid"></label>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">当前余额</label>
            <div class="layui-input-block">
                <label class="layui-form-label" id="balance"></label>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">变更金额</label>
                <div class="layui-input-inline">
                    <input type="tel" name="balance"  class="layui-input" value="">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
        <input type="hidden" name="m_id" value="">
    </form>

</div>
<script>
    function recharge(id){
        $(".recharge").show();
        $.ajax({
            url:"/admin/index/ajaxMemInfo/id/"+id,
            dataType:'json',
            success:function (data){
                console.log(data);
                $("#muid").html(data['m_id']);
                $("#balance").html(data['balance']);
                $("input[name='m_id']").val(data['m_id']);
            }
        })
    }
    $(".cls").click(function (){
        $(".recharge").hide();
    });
</script>
